

<template>
  <div class="app-container">

    <div class="app-container__section" >
      <PlusSearch
          v-bind="getSearchBinds()"
          :columns="columns"
          v-model="searchForm"
      >

        <template #plus-field-createTime>
          <el-date-picker  start-placeholder="开始时间" end-placeholder="结束时间"  v-model="searchForm.timeRange" type="daterange"  />
        </template>

      </PlusSearch>
    </div>

    <div class="app-container__section">
      <PlusTable
          v-bind="getBinds()"
          :columns="columns"
      >
        <template #empty>
          <el-empty image-size="100" description="暂无数据"></el-empty>
        </template>
        <template #title>
          <el-radio-group @change="gGetList"  v-model="searchForm.surType" >
            <el-radio-button v-for="item in surTypeList" :key="item.value" :value="item.value">
            {{ item.label}}
            </el-radio-button>
          </el-radio-group>
        </template>
        <template #toolbar>

          <el-button
              type="primary"
              plain
              icon="Plus"
              @click="handleAdd"
              v-hasPermi="['feedback:survey:add']"
          >新增</el-button>
<!--          <el-button-->
<!--              type="success"-->
<!--              plain-->
<!--              icon="Edit"-->
<!--              :disabled="gSelection.length !== 1"-->
<!--              @click="handleUpdate(gSelection[0])"-->
<!--              v-hasPermi="['feedback:survey:edit']"-->
<!--          >修改</el-button>-->
          <el-button
              type="danger"
              plain
              icon="Delete"
              :disabled="gSelection.length === 0"
              @click="handleDelete"
              v-hasPermi="['feedback:survey:remove']"
          >删除</el-button>
          <el-button
              type="warning"
              plain
              icon="Download"
              @click="handleExport"
              v-hasPermi="['feedback:survey:export']"
          >导出</el-button>

          <ClockTimer :task="gGetList" />
          <SearchAreaControl v-model="gShowSearchForm" />
        </template>

        <template #plus-cell-isPublic="{ row }">
          <dict-tag :options="sys_yes_no" :value="row.isPublic"  />
        </template>

        <template #plus-cell-repeatJoin="{ row }">
          <dict-tag :options="sys_yes_no" :value="row.repeatJoin"  />
        </template>

        <template #plus-cell-state="{ row }">
          <dict-tag :options="fed_survey_state" :value="row.state"  />
        </template>

        <template #plus-cell-action="scope">
          <el-tooltip effect="dark" content="设计" placement="top">
            <el-button  link type="primary" icon="Edit" @click="handleDesign(scope.row)"  v-hasPermi="['feedback:survey:edit']"></el-button>
          </el-tooltip>
          <el-tooltip effect="dark" content="预览" placement="top">
            <el-button  link type="success" icon="View" @click="handleView(scope.row)"  v-hasPermi="['feedback:survey:edit']"></el-button>
          </el-tooltip>
          <el-tooltip effect="dark" content="拷贝" placement="top">
            <el-button  link type="warning" icon="CopyDocument" @click="handleCopy(scope.row)"  v-hasPermi="['feedback:survey:edit']"></el-button>
          </el-tooltip>
          <el-tooltip effect="dark" content="填报数据" placement="top">
            <el-button  link type="success" icon="DataLine" @click="handleSeeData(scope.row)" ></el-button>
          </el-tooltip>
          <el-tooltip effect="dark" content="删除" placement="top">
            <el-button link type="danger" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['feedback:survey:remove']"></el-button>
          </el-tooltip>
        </template>
      </PlusTable>
    </div>
    <!--新增修改-->
    <add-form @update="gGetList" ref="addFormRef"  />
    <!--预览表单弹框-->
    <PlusDialog destroy-on-close width="1000px" :has-footer="false" title="预览问卷" v-model="previewVisible">
      <div class="max-h-[80vh] overflow-y-scroll">
        <SubmitForm :list-data='issueList' :survey-data="surveyData" />
      </div>
    </PlusDialog>
  </div>
</template>


<script setup name="Survey">
import {listSurveyApi, delSurveyApi, findSurveyIssueApi, getSurveyApi, cloneSurveyApi,} from "@/api/feedback/survey";
import { useTablePage } from '@/hooks/useTablePage.js'
import { useActions } from '@/hooks/useActions.js'
import { ref } from "vue"
import AddForm from './addForm.vue'
import {usePageCommonHook} from "./index.js";
import {PlusDialog} from "plus-pro-components";
import SubmitForm from "../design/components/submitForm.vue";
const {
  sys_yes_no,
  fed_survey_state,
  proxy,
  columns,
  primaryKey,
  fed_survey_type
} = usePageCommonHook();

// =============================================
// 列表请求逻辑
const searchForm = ref({})



const {
  gGetList,
  gSelection,
  gShowSearchForm,
  getBinds,
  getSearchBinds
} = useTablePage(listSurveyApi, {
  searchForm,
  beforeRequest(query){
    const { timeRange, ...rest } = query;
    const params = proxy.formatRangeTime(timeRange, undefined,'YYYY-MM-DD');
    return { ...rest, params }
  }
})


const surTypeList = computed(()=>{
  const data = fed_survey_type.value.map(item=>({
    label:item.label,
    value:item.value
  }))
  return [{label:'全部',value:null}, ...data]
})


const previewVisible = ref(false)
const issueList = ref([])
const surveyData = ref({})
const handleView =async (row)=>{
  // 获取单个详情，以及问卷数据
  const { data:data1 } = await findSurveyIssueApi(row.surId)
  const { data:data2 } = await getSurveyApi(row.surId)
  issueList.value = data1;
  surveyData.value = data2;
  previewVisible.value = true;
}

// 跳转设计
const handleDesign = (row)=>{
  if(row.state === '3'){
    return proxy.$modal.msgWarning('问卷收集中，不可设计！');
  }
  if(row.state === '4'){
    return proxy.$modal.msgWarning('问卷已结束，不可设计！');
  }
  proxy.$router.push({
    path: '/feedback/survey/design',
    query: {
      surId: row[primaryKey]
    }
  })
}

// 拷贝
const handleCopy = async (row)=>{
  await  proxy.$modal.confirm("确认复制此问卷吗？")
  await  cloneSurveyApi(row.surId);
  proxy.$modal.msgSuccess("复制成功，请调整问卷起止时间再发布！")
  gGetList()
}

// 删除逻辑
const { deleteAction } = useActions();
function handleDelete(row) {
  deleteAction({
    api: delSurveyApi,
    uniqueKey:primaryKey,
    selection:row[primaryKey] || gSelection.value
  }).then(() => {
    gGetList();
  });
}

const addFormRef = ref(null)
// 新增操作
const handleAdd = ()=>{
  addFormRef.value.openDialog();
}
// 修改操作
const handleUpdate = (val)=>{
  addFormRef.value.openDialog(val);
}
// 查看数据
const handleSeeData = async (row)=>{
  if(row.state !== '4'){
    return proxy.$modal.msgWarning('问卷未开始，没有填报数据！');
  }
  proxy.$router.push({
    path: '/feedback/survey/data',
    query: {
      surId: row[primaryKey]
    }
  })
}

// 导出逻辑
const  handleExport = () =>{
  proxy.download(
      'feedback/survey/export',
      {...searchForm.value},
      `survey_${new Date().getTime()}.xlsx`
  )
}
</script>


